<template>
    <el-dialog v-model="window" title="编辑团队信息" width="378">
        <!-- {{teamMsg  }} -->

        <el-form :model="editorMsg">

            <el-form-item label="团队名称">
                <el-input style="width: 200px;height: 40px;" v-model="editorMsg.name" />
            </el-form-item>

            <el-form-item label="团队头像">
                <img :src="teamMsg.teamMsg.avatar" alt="">
                <el-form-item label="+点击上传" />

            </el-form-item>
            <el-form-item label="所属机构">
                <el-select style="width: 200px;height: 40px;" v-model="editorMsg.organizationId">
                    <template v-for="item in organizationList" :key="item._id">
                        <el-option :label="item.address" :value="item._id" />
                    </template>
                </el-select>
            </el-form-item>
            <el-form-item label="团队标签">
                <el-select style="width: 200px;height: 40px;" v-model="editorMsg.tagIds" multiple>
                    <template v-for="item in getTeamTags()">
                        <el-option :label="item.name" :value="item._id"></el-option>
                    </template>
                </el-select>
            </el-form-item>

        </el-form>
        <el-button @click="window = false">取消</el-button>
        <el-button @click="accUpdateTeam()">保存</el-button>

    </el-dialog>
</template>

<script setup>
import { updateTeamApi, searchOrganizationApi } from '@/api/team';
import { useFindData } from '@/composables/findData';
import { onMounted, ref, watch } from 'vue';
// const { teamMsg, accTeamDetail } = useFindData();

// console.log(teamMsg.value);
// const emit=defineEmits(['accTeamDetail'])
const teamMsg = defineProps(['teamMsg'])
const emit = defineEmits(['refresh'])
const window = ref(false)
// 编辑团队信息
const editorMsg = ref({})
// 机构列表
const organizationList = ref([])

// 获取机构列表
async function getOrganizationList() {
    const res = await searchOrganizationApi()
    if (res.code == 200) {
        organizationList.value = res.data.rows
    }
}

// 初始化编辑表单数据
function initEditorData() {
    console.log('初始化编辑数据:', teamMsg);

    // 处理不同的数据结构
    let teamData = teamMsg;
    if (teamMsg.teamMsg) {
        teamData = teamMsg.teamMsg;
    }

    if (teamData && teamData.name) {
        editorMsg.value = {
            name: teamData.name,
            organizationId: teamData.organizationId?._id,
            tagIds: teamData.tagIds?.map(tag => tag._id) || []
        }
        console.log('初始化后的编辑数据:', editorMsg.value);
    } else {
        console.warn('团队数据为空或格式不正确:', teamData);
    }
}

onMounted(() => {
    getOrganizationList()
})

// 编辑团队信息
async function accUpdateTeam() {
    // 处理不同的数据结构
    let teamData = teamMsg;
    if (teamMsg.teamMsg) {
        teamData = teamMsg.teamMsg;
    }

    const res = await updateTeamApi({
        ...editorMsg.value,
        _id: teamData._id
    })
    if (res.code == 200) {
        ElMessage({
            type: 'success',
            message: '保存成功',
        })
        window.value = false
        emit('refresh')
        console.log(res);
    }
}



function openEditor() {
    console.log('打开编辑器，当前团队数据:', teamMsg);
    initEditorData()
    window.value = true
}

// 获取团队标签
function getTeamTags() {
    let teamData = teamMsg;
    if (teamMsg.teamMsg) {
        teamData = teamMsg.teamMsg;
    }
    return teamData?.tagIds || [];
}





defineExpose({
    openEditor
})

</script>

<style scoped></style>